<?php include(BASE_PATH . "/view/layout/layoutP.phtml"); ?>
<style>
.waybill_cont{
    background-color: #F2F2F2;
    background-image: url(/img/service/background.jpg);
    background-position: 50% 25%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    color: #333;
    width: 100%;
    height: 700px;
    padding-top: 50px;
}
.waybill_input{
    width: 1000px;
    min-height: 400px;
    max-height: 1000px;
    margin: 0 auto;
    background: white;
    border-radius: 5px;
    padding-bottom: 50px;
}
.waybill_input h3{
    line-height: 65px;
    padding-left: 60px;
    font-size: 18px;
    color: #000;
    font-weight: normal;}
.waybill_input input{
    padding-left: 10px;
    height: 40px;
    width: 400px;
    border: 1px solid #cdcdcd;
    border-radius: 3px;
    margin: 0 60px;
}
.waybill_input .btn{
    background-color: #eb1d21;
    background-image: linear-gradient(#f7282c,#c21e22);
    border: none;
    height: 40px;
    width: 120px;
    color: #fff;
    border-radius: 3px;
    margin-right: 20px;
    position: relative;
    top:-1px;
}
.waybill_input .btn:hover {
    top: -2px;
    background-color: #a94442;
    background-image: linear-gradient(#eb1d21,#a94442);
}
.wayLogCont{
    margin-top: 20px;
    padding-left: 60px;
}

.loginfoCont{
    height: 56px;
    width: 585px;
    margin-top: 10px;
}
.xian{
    border: 1px solid #D1D1D1;
    width: 0px;
    height: 53px;
    position: relative;
    left: 6px;
    display: inline-block;
    clear: both;
    float: left;
}
.yuan{
    width: 10px;
    height: 10px;
    background: #9d9696;
    border-radius: 9px;
    margin: 13px 0px 3px 4px;
}
.weizhi{
    display: block;
    float: left;
}
.logText{
    padding-left: 30px;
    height: 50px;
    position: relative;
}
.waydate{
    font-size: 12px;
    position: absolute;
    bottom: 0;
}
.loginfoCont{
    color: #9b9b9b;
}
.loginfoCont:first-child{
    color: red;
}

</style>
<div class="waybill_cont">
    <div class="waybill_input">
        <h3>快件追踪</h3>
        <input class="orderNo" type="text" name="waybillNo" placeholder="请输入快递单号" maxlength="50">
        <button type="button" class="btn" id="search">查询</button>
        <div class="wayLogCont">
<!--            <div class="loginfoCont">-->
<!--                <img class="weizhi" src="/img/order/wei.png" width="13">-->
<!--                <span class="xian"></span>-->
<!--                <div class="logText">-->
<!--                    <p class="waylogText">您的快件在【湖南分配中心】验货完成，正在分配人员</p>-->
<!--                    <p class="waydate">2017-4-6 15:28</p>-->
<!--                </div>-->
<!--            </div>-->
        </div>
    </div>
</div>

<script>
$(function () {
    Loginfo.init();
})

var Loginfo = {
    init:function () {
        this.btnEvent();
    },
    btnEvent:function () {
        $("#search").click(function () {
            var orderNo = $(".orderNo").val();
            Loginfo.getLogData(orderNo);
        })
    },
    getLogData:function (orderNo) {
        $.ajax({
            type: "POST",
            url: "/application/order/waybillInfo",
            datatype: "JSON",
            data: {"orderNo":orderNo},
            success: function (ret) {
                ret = JSON.parse(ret);
                var html="";
                for(var i=0;i<ret.length;i++){
                    if(i == 0){
                        var src = "/img/order/wei.png";
                    }else {
                        var src = "/img/order/yuan.png";
                    }
                    html += '<div class="loginfoCont">'
                    html += '<img class="weizhi" src="'+src+'" width="13">'
                    html += '<span class="xian"></span>'
                    html += '<div class="logText">'
                    html += '<p class="waylogText">'+ret[i].loginfo+'</p>'
                    html += '<p class="waydate">'+ret[i].arrive_dt+'</p>'
                    html += '</div></div>';
                }
                $(".wayLogCont").html(html);
            },
            error: function () {

            }
        })
    }
}
</script>
<?php include(BASE_PATH . "/view/layout/footer.phtml"); ?>
